import React, { PureComponent } from "react";
import { connect } from "react-redux";
import { actions, getGetnew,getGetseckill,getGetgroupon,getGetcountdown,getGetindexgoods,getFlag,getGetcoupon} from "../../store/modules/home";
import { bindActionCreators } from "redux";
import './Home.css'

import Newpeople from './componennts/newpeople/newpeople'
import Seckill from './componennts/Seckill/Seckill'
import Group from './componennts/Group/Group'
import Countdown from './componennts/Countdown/Countdown'
import Indexgoods from './componennts/Indexgoods/Indexgoods'
import Coupon from './componennts/Coupon/coupon'
// import './Home.css'
class Home extends PureComponent {
  render() {
    let { getnew,getseckill,getgroupon,getcountdown,getindexgoods,flag,home:{changeFlag},getcoupon} = this.props;
    console.log(getcoupon);
    return (
      <div className='home'>
          {/* <div>
              <div>
                  <input type="text" placeholder='搜索商品'/>
              </div>
          </div> */}
         {/* 新人专享 */}
         <Newpeople getnew={getnew}></Newpeople>
         {/* 优惠券 */}
         <Coupon getcoupon={getcoupon} ></Coupon>
         {/* 秒杀 */}
         <Seckill getseckill={getseckill}></Seckill>
         {/* 万人团 */}
         <Group getgroupon={getgroupon}></Group>
         {/* 倒计时 */}
         <Countdown getcountdown={getcountdown}></Countdown>
         <ul className='f'>
             <li onClick={()=>changeFlag(0)} className={flag===0?'active':''}>1</li>
             <li onClick={()=>changeFlag(1)} className={flag===1?'active':''}>2</li>
             <li onClick={()=>changeFlag(2)} className={flag===2?'active':''}>3</li>
             <li onClick={()=>changeFlag(3)} className={flag===3?'active':''}>4</li>
         </ul>
         {/* 商品信息首页 */}
         <Indexgoods getindexgoods={getindexgoods} flag={flag}></Indexgoods>

      </div>
    );
  }
  componentDidMount(){
      let {reqGetNew,reqGetSeckill,reqGetgroupon,reqGetcountdown,reqGetindexgoods,reqGetcoupon}=this.props.home
      reqGetNew()
      reqGetSeckill()
      reqGetgroupon()
      reqGetcountdown()
      reqGetindexgoods()
      reqGetcoupon()
  }
}
//收数据
let mapStateToProps = (state) => ({
    //新人专享
  getnew: getGetnew(state),
  //秒杀
  getseckill:getGetseckill(state),
  //万人团
  getgroupon:getGetgroupon(state),
  //倒计时
  getcountdown:getGetcountdown(state),
  //商品信息首页
  getindexgoods:getGetindexgoods(state),
  //导航标识
  flag:getFlag(state),
  //优惠券
  getcoupon:getGetcoupon(state),
});
//收方法
let mapDispatchToProps = (dispatch) => ({
  home: bindActionCreators(actions, dispatch),
});
export default connect(mapStateToProps, mapDispatchToProps)(Home);
